.article-data {
    & li {
        display: flex;
        float: left;
        width: calc(50% - 20px);
        padding: 10px 10px;
        margin: 0;
        overflow: hidden;
        -webkit-transition: all .3s ease 0s;
        -o-transition: all .3s ease 0s;
        transition: all .3s ease 0s;
        & .article-img {
            position: relative;
            width: 190px;
            height: 145px;
            overflow: hidden;
            border-radius: 4px;
            -webkit-flex-shrink: 0;
            -ms-flex-negative: 0;
            flex-shrink: 0;
            -webkit-box-flex: 0;
            -webkit-flex-grow: 0;
            -ms-flex-positive: 0;
            flex-grow: 0;
            & img{
                position: relative;
                max-width: none;
                width: 100%;
                height: 145px;
                -o-object-fit: cover;
                object-fit: cover;
            }
        }
        & .blog-text {
            margin-left: 15px;
            & .blog-title {
                display: -webkit-box;
                & h3 {
                    display: -webkit-box;
                    margin: 0;
                    width: 360px;
                }
                & a {
                    display: block;
                    width: 100%;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }
            }
            & .blog-label {
                margin-top: 10px;
            }
            & .blog-describe {
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;
                text-overflow: ellipsis;
                overflow: hidden;
                font-size: 14px;
                color: #555;
                line-height: 25px;
                line-height: 1.8;
                margin: 0.5em 0;
                height: 53px;
            }
            & .item-meta {
                display: flex;
                align-items: center;
                margin-top: auto;
                font-size: 13px;
                height: 20px;
                & .item {
                    display: flex;
                    align-items: center;
                    font-size: 13px;
                    color: #999;
                    margin-right: 10px;
                    & img {
                        width: 15px;
                        height: 15px;
                        display: inline-block;
                        border-radius: 100%;
                        position: relative;
                        top: -1px;
                    }
                }
                & .item-meta-user {
                    flex: 1;
                    & a {
                        color: #757575;
                    }
                }
            }
        }
    }
    & li:hover {
        border-radius: 4px;
        box-shadow: 3px 3px 9px #ccc;
        transition: .6s;
    }
}